Next.js から Astro に遷宮
201909あたりに Next.js へ遷宮した自分のポータルサイト的なやつを Astro に書き換えた next@13 で追加された appDir がまだ Static Export に対応していなかったのと、React も next も元々オーバーキル感が強くて微妙だとおもっていたので思い切って書き換えた 当時は SSG でイイ感じにパッケージングされてる選択肢が限られていて、消極的に next を採用したのもあり 最近はすっかり vite ばっかり使ってて、いける手応えが結構ある Astro は1.0出たし、テンプレートの記法はベター JSX といってよいと感じる
もちろん JSX はコンパイルすればピュアな JS に落ちるという利点があるとはおもうが、だから何?って最近はおもってきた
TIL
svg をインラインで読みたい:
frontmatter 部分に const { default: innerHTML } = await import("some.svg?raw"); てな具合で import すると innerHTML には svg の中身が string として格納されるので、あとはこいつをテンプレートで参照すればよい
json の string を union に upcast したい:
json の特定の key には string の union として提供されている型の中身しか入ってないけど、それを表現する術がねえ....と困るのだが、hoge as Foo 的な感じで as を使っても、string は Foo に upcast できないよ〜んと怒られてしまう
あまり good なプラクティスにはみえないけど hoge as unknown as Foo と一旦 unknown に落としてやることで無理矢理 upcast できる
VSC でフォーマットされたい:
Astro の ext 入れたらイイ感じになるのかなとおもったら別途 prettier の設定をいれないとダメだった